import React, { useEffect, useState } from 'react';
import {
  Button,
  Checkbox,
  Form,
  Input,
  Col,
  Row,
  Select,
  TreeSelect,
} from 'antd';
import './centre.less';
import request from 'umi-request';
const { TextArea } = Input;
export default function Add() {
  const [ids, setids] = useState(''); // 所属类别
  const [mYprofileshus, setmYprofileshus] = useState([]);
  useEffect(() => {
    request('/api/hqh/mYprofileshu').then((res) => {
      setmYprofileshus(res.data);
    });
    request
      .get('/api/hqh/myprofile?id=' + localStorage.getItem('datum_id'))
      .then((res) => {
        setids(res.data[0]._id);
        setjianjie(res.data[0].jianjie);
        setxiangmuleix(res.data[0].xiangmuleix);
        setname(res.data[0].name);
        setnameselect(res.data[0].nameselect);
      });
    console.log('Wwwwwwwwwwwww', ids);
  }, []);
  const onFinish = (values: any) => {
    console.log('Success:', values);
  };

  const onFinishFailed = (errorInfo: any) => {
    console.log('Failed:', errorInfo);
  };
  // 下拉框

  const handleChange = (value: string) => {
    setnameselect(value);
  };
  const [nameselect, setnameselect] = useState(''); // 所属类别
  const [jianjie, setjianjie] = useState(''); // 文档简介
  const [names, setname] = useState(''); // 文档名称
  const [xiangmuleix, setxiangmuleix] = useState(''); // 项目类型
  return (
    <div>
      <div className="buttondata">
        <Button
          onClick={() => {
            let datas = {
              nameselect,
              jianjie,
              name: names,
              xiangmuleix,
              personnel: '张妍',
            };
            request.put('http://localhost:8597/hqh/myprofile?id=' + ids, {
              data: { datas },
            });
            setnameselect();
            setjianjie();
            setname();
            setxiangmuleix();
          }}
        >
          新增
        </Button>
        <Button>保存</Button>
      </div>
      <div>
        <div className="myname_insert">
          <ul style={{ listStyle: 'none' }}>
            <li
              style={{
                display: 'flex',
                justifyContent: 'center',
                alignContent: 'center',
              }}
            >
              <span
                style={{ width: '80px', marginTop: '5px', marginLeft: '5px' }}
              >
                文档名称*:
              </span>{' '}
              <Input
                value={names}
                onChange={(e) => {
                  setname(e.target.value);
                }}
              />
            </li>
            <li
              style={{
                display: 'flex',
                justifyContent: 'center',
                alignContent: 'center',
                marginTop: '5px',
              }}
            >
              <span
                style={{ width: '80px', marginTop: '5px', marginLeft: '5px' }}
              >
                文档分类*:
              </span>{' '}
              <TreeSelect
                treeLine={true}
                style={{ width: '100%' }}
                onChange={(newValue) => {
                  setnameselect(newValue);
                }}
                fieldNames={{
                  label: 'name',
                  value: 'name',
                  children: 'name_id',
                }}
                treeData={mYprofileshus}
              />
              {/* <Select
                style={{ width: '100%' }}
                onChange={handleChange}
                options={[
                  { value: '人事制度', label: '人事制度' },
                  { value: '营销制度', label: '营销制度' },
                  { value: '产品资料', label: '产品资料' },
                  { value: '工作笔记', label: '工作笔记' },
                ]}
              /> */}
            </li>
            <li
              style={{
                display: 'flex',
                justifyContent: 'center',
                alignContent: 'center',
                marginTop: '5px',
              }}
            >
              <span
                style={{ width: '80px', marginTop: '5px', marginLeft: '5px' }}
              >
                文档简介*:
              </span>{' '}
              <TextArea
                rows={40}
                value={jianjie}
                onChange={(e) => {
                  setjianjie(e.target.value);
                }}
              />
            </li>
            <li
              style={{
                display: 'flex',
                justifyContent: 'center',
                alignContent: 'center',
                marginTop: '5px',
              }}
            >
              <span
                style={{ width: '80px', marginTop: '5px', marginLeft: '5px' }}
              >
                文档类型*:
              </span>{' '}
              <Input
                value={xiangmuleix}
                onChange={(e) => {
                  setxiangmuleix(e.target.value);
                }}
              />
            </li>
          </ul>
          <Button>批量上传</Button>
          <Button>删除</Button>
        </div>
      </div>
    </div>
  );
}
